import './Nomenton.scss'
import http from '../../../utils/http'
import Taro from '@tarojs/taro'
import React, { useState, useEffect } from 'react'
import { View, Text, Navigator } from '@tarojs/components';
import { AtIcon, AtSearchBar } from 'taro-ui'

// const Arr = () => {
//   const [arr, setArr] = useState([{ name: '你', date: '2020 - 01 - 05' },
//   { name: '你好', date: '2020 - 01 - 03' },
//   { name: '你好好', date: '2020 - 01 - 11' },
//   { name: '你好好好', date: '2020 - 01 - 04' }])
//   return <View>
//     {arr.map((item, index) => { return (<Text key={index}>{item.name}</Text>) })}
//   </View>
// }

const Nomention = () => {
  // 获取input里面的值
  const [isSel, setiSsel] = useState(isSel)
  //数据
  const [list, setList] = useState([])


  const onChange = (e) => {
    console.log(e);
    setiSsel(isSel)
  }

  //请求数据 
  useEffect(() => {
    let Gettoken = Taro.getStorageSync('token')
    http({
      url: '/user/userNotGetOrderQuery',
      method: 'get',
      data: {
        pickState: 0  //返回状态 0 未提 1 已提
      },
      header: {
        'token': Gettoken
      }
    }).then((res) => {
      console.log(res);
      setList([res.data.data[0]])
    })
  }, [])

  useEffect(() => { }, [list])

  //排序
  // 时间从高到低
  const High = () => {
    let p1 = arr.sort(function (a, b) {
      return a.date < b.date ? 1 : -1
    })
    console.log(p1);
  }
  // 时间从低到高
  // const [arr, setArr] = useState([{ name: '你', date: '2020 - 01 - 05' },
  // { name: '你好', date: '2020 - 01 - 03' },
  // { name: '你好好', date: '2020 - 01 - 11' },
  // { name: '你好好好', date: '2020 - 01 - 04' }])
  const Low = () => {
    let p = arr.sort(function (a, b) {
      return a.date > b.date ? 1 : -1
    })
    console.log(p);
  }

  // let b = 6
  return <View>
    {/* 排序 */}
    <View className='cont'>
      <View className='at-row at-row__justify--between'>
        <View className='at-col at-col-5 at-col__offset-1'>
          订单列表
        </View>
        <View className='at-col at-col-5 at-col__offset-2'>
          <Text>时间排序</Text>
          <View className='icon'>
            <View className='at-icon at-icon-chevron-up' onClick={High}></View>
            <View className='at-icon at-icon-chevron-down' onClick={Low}></View>
          </View>
        </View>
      </View>

    </View>

    {/* 搜索 */}
    <View>
      <View className='at-row'>
        <View className='at-col at-col-22 tent'>
          <AtSearchBar placeholder="输入商家名称或商品名称"
            value={isSel}
            onChange={onChange.bind(this)}
          ></AtSearchBar>
        </View>
      </View>
    </View>

    {/* 内容 */}
    {
      list.map((v, i) => {
        return <View className='theuser' key={i}>
          <View>
            <View>
              <View className='the'>
                <Text>提货点：</Text>
                <Text>{v.gmTt}</Text>
                <Text>电话：</Text>
                <Text>{v.stPhone}</Text>
              </View>
            </View>
            <View>
              <Text>[{v.gmNum}人成团]</Text>
              <Text>{v.goodsName}200g/份</Text>
            </View>
            <View>
              <View>
                <View className='the'>
                  <Text>提货人：</Text>
                  <Text>{v.pickNme}</Text>
                  <Text>手机号：</Text>
                  <Text>{v.pickPhone}</Text>
                  <Text>数量：</Text>
                  <Text>x{v.buyNum}</Text>
                </View>
              </View>
            </View>
            {/* 按钮 */}
            <Navigator url='./Noorder'>
              <View className='button'>
                <Text>未提货</Text>
              </View>
            </Navigator>
            <View>
            </View>
          </View>
        </View>
      })
    }


  </View>
}

export default Nomention;